<template>
    <div>
      <div class="detail-top-tab pc-bk" >
        <navblock></navblock>
      </div>
      <div class="container">
        <div class="leftMenu">
          <div class="search-link-home">
            <div class="detail-search">
              <input type="text"  v-model="searchtext" placeholder="全站搜索   Search" @keyup.enter="searchBtn1">
              <div>
                <img src="../../../img/mobile/search_new.png"  @click="searchBtn1">
              </div>
            </div>
          </div>
          <ul class="frame chinese">
            <li class="li1">论坛服务</li>
            <a href="#/annualMeeting"><li><span class="focus-icon"></span><span class="s1">关于年会</span></li></a>
            <a href="#/proceedings"><li><span class="focus-icon"></span><span class="s1">年会议程</span><span>MEETING SCHEDULE</span></li></a>
            <a href="#/applyFormPerson"><li><span class="focus-icon"></span><span class="s1">参会报名</span><span>MEETING SCHEDULE</span></li></a>
            <a href="#/applyFormMedia"><li><span class="focus-icon"></span><span class="s1">媒体报名</span><span>MEETING SCHEDULE</span></li></a>
            <a href="#/trafficInfo"><li><span class="focus-icon"></span><span class="s1">交通信息</span><span>MEETING SCHEDULE</span></li></a>
            <a href="#/hotel"><li><span class="focus-icon"></span><span class="s1">酒店信息</span><span>MEETING SCHEDULE</span></li></a>
            <a href="#/contactUs"><li><span class="focus-icon"></span><span class="s1">联系我们</span><span>MEETING SCHEDULE</span></li></a>
          </ul>
          <ul class="frames english">
            <li class="li1">论坛服务</li>
            <a href="#/annualMeeting"><li><span class="focus-icon"></span><span class="s1">About Annual Conference</span></li></a>
            <a href="#/proceedings"><li><span class="focus-icon"></span><span class="s1">Conference Agenda</span></li></a>
            <a href="#/applyFormPerson"><li><span class="focus-icon"></span><span class="s1">Guest Registration</span></li></a>
            <a href="#/applyFormMedia"><li><span class="focus-icon"></span><span class="s1">Media Registration</span></li></a>
            <a href="#/trafficInfo"><li><span class="focus-icon"></span><span class="s1">Travel Information</span></li></a>
            <a href="#/hotel"><li><span class="focus-icon"></span><span class="s1">Hotel Information</span></li></a>
            <a href="#/contactUs"><li><span class="focus-icon"></span><span class="s1">Contact Us</span></li></a>
          </ul>
        </div>
        <div class="centerMenu">
          <div class="centerMenuTop" style="cursor: pointer;">
            <span>论坛服务</span>
            <span>></span>
            <span>媒体报名</span>
            <!-- <div>
              <span>中文</span>
              <span> / </span>
              <span>EN</span>
            </div> -->
          </div>
          <slot name="container"></slot>
        </div>
        <!-- <div class="rightMenu">

          <div class="rightPic"> </div>
        </div> -->
      </div>
      <div class="commonFooter">
        <footernav></footernav>
      </div>
    </div>
</template>
<script>
import searchtab from '../../mobile/components/searchtab'
import footernav from '../../mobile/components/footernav'
import navblock from '../../mobile/components/nav'
export default {
  data () {
    return {
      showsearch: '',
      showsearchlist: '',
      searchtext: ''
    }
  },
  components: {
    searchtab,
    footernav,
    navblock
  },
  created () {},
  mounted () {
    this.languageShow(sessionStorage.getItem('language') === 'e')
  },
  methods: {
    opensearch (val) {
      console.log('test:' + val)
      this.showsearch = val
    },
    searchlink (val) {
      console.log('testsss:' + val)
      this.showsearchlist = val
    },
    searchBtn1 () {},
    languageShow (i) {
      if (i) {
        $('.chinese').hide()
        $('.english').show()
      } else {
        $('.chinese').show()
        $('.english').hide()
      }
    }
  }
}
</script>
<style scoped>
body {
  font-family: “Microsoft YaHei”;
}
.container {
  width: 1200px;
  margin: 0 auto;
  min-height: 1000px;
  /* background: red; */
  padding-top: 20px;
  overflow: hidden
}
.topBanner {
  width: 100%;
  height: 280px;
  background: url("../../../img/PC/pcbanner.jpg");
  background-size: cover;
}
.leftMenu ul {
  width: 281px;
  height: 493px;
  /* background: saddlebrown; */
  float: left;
  overflow: hidden;
}
.leftMenu ul li {
  width: 280px;
  height: 28px;
  /* line-height: 35px; */
  border-left: none;
  margin-bottom: 10px;
  line-height: 28px;
  background: #E6E6E6;
  position: relative;
}
.leftMenu ul{
  margin-top: 55px
}
.leftMenu ul .li1 {
  height: 38px;
  line-height: 38px;
  margin-bottom: 10px;
  color: #EFEDE8;
  background: #A62037;
  font-size: 16px;
  padding-left: 27px;
  box-sizing: border-box
}
.leftMenu ul li:not(.li1):hover {
    background: #f2f2f2;

}

.leftMenu ul li:hover .s1{
    color: #A72037;
}
.centerMenu {
  width: 580px;
  min-height: 500px;
  /* background: salmon; */
  float: left;
  margin: 0 25px;
}
.centerMenuTop {
  width: 100%;
  height: 40px;
  box-sizing: border-box;
  border-left: 3px solid #6c5b53;
  background: #f2f2f2;
  line-height: 41px;
  font-size: 16px;
  text-indent: 12px;
  color: #666666;
  position: relative;
  margin-bottom: 15px;
}
.rightMenu {
  float: right;
  width: 280px;
  height: 40px;
}

li .s1,
.s2 {
  float: left;
  margin-left: 50px;
  font-size: 12px;
  color: #666666;
}
ul a {
  color: #666666;
}
.li1 span {
  padding-left: 25px;
}
.search-link-home {
  width: 280px;
  background: white;
  margin-bottom: 10px
}
.detail-search{
  border: 1px solid black;
}
.detail-search{
  height: 40px;
  width: 280px;
  box-sizing: border-box;
  position: relative;
}
.detail-search input{
  height: 38px;
  background: white;
  font-size: 14px;
  color: #666666
}
.detail-search div{
  width: 38px;
  height: 38px;
  /* background: #F2F2F2; */
  position: absolute;
  right: 0px;
  top: 0px
}
.detail-search img{
  right: 0;
  padding: 10px
}
.rightPic{
  width: 280px;
  height: 580px;
  background: seagreen;
  margin-top: 50px;
}
.commonFooter{
  background: #F2F2F2
}
.centerMenuTop div{
  width: 75px;
  height: 18px;
  border-radius:5px;
  line-height: 18px;
  background: #6c000c;
  position: absolute ;
  right: 13px;
  top: 10px;
  font-size: 12px;
  color: white
}
.focus-icon{
    background-image: url(../../../img/mobile/hy-list-icon.png);
    width: 10px;
    height: 11px;
    background-size: 100%;
    display: inline-block;
    box-sizing: border-box;
    position: absolute;
    /* top: 12px; */
    left: 15px;
    top:8px
  }
.leftMenu ul li:hover .focus-icon{
  background-image: url(../../../img/mobile/hy-list-icon1.png);
}
ul li span:nth-of-type(3){
  float: right;
  padding-right: 10px
}
ul li span:nth-of-type(2){
 font-size: 14px;
 font-weight: 700;
 margin-left:37px
}
</style>
